<template>
  <div class="approval" v-title data-title="项目立项审批界面">
    <home-nav :userData="userinfo"></home-nav>
    <div class="banner"></div>
    <!--选人-->
    <a-modal
      :title="userSel.title"
      :visible="userSel.visible"
      :confirm-loading="userSel.confirmLoading"
      @ok="userSelHandleOk"
      @cancel="userSelHandleCancel"
    >
      <div style="width: 250px; margin-bottom: 20px">
        <a-input-search
          placeholder="输入代码或者名称查询"
          enter-button
          v-model="userSel.keyword"
          @search="userSelSearch"
        />
      </div>
      <a-table
        :row-selection="userSelRowSelection"
        :columns="userSel.colums"
        bordered
        :pagination="true"
        :data-source="userSel.data"
        size="small"
        :key="userSel.freshKey"
        :rowKey="
          (record, index) => {
            return index
          }
        "
      >
      </a-table>
    </a-modal>
    <!--选择是否需要上会 -->
    <a-modal
      title="消息提醒"
      :visible="confirmMeetVisible"
      :confirm-loading="false"
      @cancel="notNeedMeet(true)"
      :maskClosable="false"
      :closable="true"
    >
      请确认您的项目是否需要上会?
      <template slot="footer">
        <a-button key="submit" type="primary" :loading="loading" @click="needMeet"> 需要上会 </a-button>
        <a-button key="back" @click="notNeedMeet(false)"> 不需要上会 </a-button>
      </template>
    </a-modal>
    <process-meet-select :columns="selMeetCols" @selectMeetConfirm="selectMeetConfirm" ref="processMeetConfirm" />
    <!--跳转上会界面-->
    <a-modal
      title="消息提醒"
      :visible="toMeetVisible"
      :confirm-loading="false"
      @ok="toMeetOk"
      @cancel="toMeetVisible = false"
    >
      该项目需上会，请填写上会结果后再审批；<br />
      是否上会完成，如已上会请填写上会结果。
    </a-modal>
    <div class="project-summary" ref="imageWrapper">
      <div style="color: #333; font-size: 18px; font-weight: bold; margin: 15px 0px">
        <span style="margin-right: 30px"> 项目编号：{{ projectAuditInfo.projectBuild.projectNo }} </span>
        <span style="margin-right: 30px"> 项目名称：{{ projectAuditInfo.projectBuild.projectName }} </span>
        <span> 项目经理：{{ ['30','40','41'].includes(projectClass) ? projectAuditInfo.approvalProjectManager : projectAuditInfo.projectManager }} </span>
      </div>
      <ul>
        <li :class="{ clickShow: pageId == 1 }" @click="handleToggle(1)">项目概述</li>
        <li v-if="projectAuditInfo.hadXY" :class="{ clickShow: pageId == 2 }" @click="handleToggle(2)">价值表</li>
        <li v-if="projectAuditInfo.hadCore" :class="{ clickShow: pageId == 3 }" @click="handleToggle(3)">核心力值</li>
        <li :class="{ clickShow: pageId == 4 }" @click="handleToggle(4)">团队表</li>
        <li :class="{ clickShow: pageId == 5 }" @click="handleToggle(5)">附件</li>
        <li
          v-if="projectAuditInfo.projectBuildMeets != null && projectAuditInfo.projectBuildMeets.length > 0"
          :class="{ clickShow: pageId == 6 }"
          @click="handleToggle(6)"
        >
          上会结果
        </li>
      </ul>
      <div class="project-container" v-show="pageId == 1">
        <!-- 项目基本信息 -->
        <div class="info-title">
          <img src="@/assets/category-blue.png" alt="" />
          <span>项目基本信息</span>
        </div>
        <project-build-basic-show
          :project-audit-info="projectAuditInfo"
          :isOld="isOld"
          :freshKey="basicFreshKey"
        ></project-build-basic-show>

        <!-- 科技技术列表 -->
        <div
          class="project-kpi"
          v-if="
            projectClass == '10' &&
            projectAuditInfo.techList != null &&
            projectAuditInfo.techList.length > 0 &&
            projectAuditInfo.techList.filter((item) => item.baseType && item.baseType == 1) &&
            projectAuditInfo.techList.filter((item) => item.baseType && item.baseType == 1).length > 0
          "
        >
          <div class="info-title">
            <img src="@/assets/category-blue.png" alt="" />
            <span>技术目标</span>
          </div>
          <!-- <div class="info-detail">
            <ul class="info-list" v-for="(projectBuildKpi) in projectAuditInfo.techList.filter(item => item.baseType && item.baseType == 1 && item.channel && item.channel == '1')" :key="projectBuildKpi.id">
              <li style="width: 33%">
                <img src="@/assets/dbcircle.png" alt="" />
                <span class="list-title">维度：</span>
                <span>{{ projectBuildKpi.dimension ? projectBuildKpi.dimension : '--' }}</span>
              </li>
              <li style="width: 33%">
                <img src="@/assets/dbcircle.png" alt="" />
                <span class="list-title">目标：</span>
                <span>{{ projectBuildKpi.projectTarget ? projectBuildKpi.projectTarget : '--' }}</span>
              </li>
              <li style="width: 34%">
                <img src="@/assets/dbcircle.png" alt="" />
                <span class="list-title">取数依据：</span>
                <span>{{ projectBuildKpi.basisData ? projectBuildKpi.basisData : '--' }}</span>
              </li>
            </ul>
          </div> -->
          <a-table
            :columns="techColumns"
            :data-source="projectAuditInfo.techList.filter((item) => item.baseType && item.baseType == 1)"
            :rowKey="(record) => record.id"
            bordered
            :pagination="false"
          ></a-table>
        </div>
        <!-- 科技经济列表 -->
        <div
          class="project-kpi"
          v-if="
            projectClass == '10' &&
            projectAuditInfo.techList != null &&
            projectAuditInfo.techList.length > 0 &&
            projectAuditInfo.techList.filter((item) => item.baseType && item.baseType == 2) &&
            projectAuditInfo.techList.filter((item) => item.baseType && item.baseType == 2).length > 0
          "
        >
          <div class="info-title">
            <img src="@/assets/category-blue.png" alt="" />
            <span>经济目标</span>
          </div>
          <a-table
            :columns="techColumns"
            :data-source="projectAuditInfo.techList.filter((item) => item.baseType && item.baseType == 2)"
            :rowKey="(record) => record.id"
            bordered
            :pagination="false"
          ></a-table>
        </div>
        <!-- 知产列表 -->
        <div
          class="project-kpi"
          v-if="
            projectClass == '10' &&
            projectAuditInfo.techList != null &&
            projectAuditInfo.techList.length > 0 &&
            projectAuditInfo.techList.filter((item) => item.baseType && item.baseType == 3) &&
            projectAuditInfo.techList.filter((item) => item.baseType && item.baseType == 3).length > 0
          "
        >
          <div class="info-title">
            <img src="@/assets/category-blue.png" alt="" />
            <span>知产目标</span>
          </div>
          <a-table
            :columns="knowledgeColumns"
            :data-source="projectAuditInfo.techList.filter((item) => item.baseType && item.baseType == 3)"
            :rowKey="(record) => record.id"
            bordered
            :pagination="false"
          ></a-table>
        </div>
        <!-- 科技其他列表 -->
        <div
          class="project-kpi"
          v-if="
            projectClass == '10' &&
            projectAuditInfo.techList != null &&
            projectAuditInfo.techList.length > 0 &&
            projectAuditInfo.techList.filter((item) => item.baseType && item.baseType == 9) &&
            projectAuditInfo.techList.filter((item) => item.baseType && item.baseType == 9).length > 0
          "
        >
          <div class="info-title">
            <img src="@/assets/category-blue.png" alt="" />
            <span>其他目标</span>
          </div>
          <a-table
            :columns="techColumns"
            :data-source="projectAuditInfo.techList.filter((item) => item.baseType && item.baseType == 9)"
            :rowKey="(record) => record.id"
            bordered
            :pagination="false"
          ></a-table>
        </div>

        <!-- F项目业务应用范围 -->
        <div
          class="project-kpi"
          v-if="
            projectClass == '30' &&
            projectAuditInfo.projectBuildKpiList != null &&
            projectAuditInfo.projectBuildKpiList.length > 0 &&
            projectAuditInfo.projectBuildKpiList.filter((item) => item.baseType && item.baseType == 1) &&
            projectAuditInfo.projectBuildKpiList.filter((item) => item.baseType && item.baseType == 1).length > 0
            && isOld
          "
        >
          <div class="info-title">
            <img src="@/assets/category-blue.png" alt="" />
            <span>业务应用范围</span>
          </div>
          <div class="info-detail">
            <ul
              class="info-list"
              v-for="projectBuildKpi in projectAuditInfo.projectBuildKpiList.filter(
                (item) => item.baseType && item.baseType == 1
              )"
              :key="'info-list-0_' + projectBuildKpi.id"
            >
              <li style="width: 25%">
                <img src="@/assets/dbcircle.png" alt="" />
                <span class="list-title">功能\流程：</span>
                <span>{{ projectBuildKpi.kpiDescribe ? projectBuildKpi.kpiDescribe : '--' }}</span>
              </li>
              <li style="width: 75%">
                <img src="@/assets/dbcircle.png" alt="" />
                <span class="list-title">应用说明：</span>
                <span>{{ projectBuildKpi.kpiTarget ? projectBuildKpi.kpiTarget : '--' }}</span>
              </li>
            </ul>
          </div>
        </div>
        <!-- F项目技术应用范围 -->
        <div
          class="project-kpi"
          v-if="
            projectClass == '30' &&
            projectAuditInfo.projectBuildKpiList != null &&
            projectAuditInfo.projectBuildKpiList.length > 0 &&
            projectAuditInfo.projectBuildKpiList.filter((item) => item.baseType && item.baseType == 2) &&
            projectAuditInfo.projectBuildKpiList.filter((item) => item.baseType && item.baseType == 2).length > 0
            && isOld
          "
        >
          <div class="info-title">
            <img src="@/assets/category-blue.png" alt="" />
            <span>技术应用范围</span>
          </div>
          <div class="info-detail">
            <ul
              class="info-list"
              v-for="projectBuildKpi in projectAuditInfo.projectBuildKpiList.filter(
                (item) => item.baseType && item.baseType == 2
              )"
              :key="'info-list-1_' + projectBuildKpi.id"
            >
              <li style="width: 25%">
                <img src="@/assets/dbcircle.png" alt="" />
                <span class="list-title">技术\功能：</span>
                <span>{{ projectBuildKpi.kpiDescribe ? projectBuildKpi.kpiDescribe : '--' }}</span>
              </li>
              <li style="width: 75%">
                <img src="@/assets/dbcircle.png" alt="" />
                <span class="list-title">应用说明：</span>
                <span>{{ projectBuildKpi.kpiTarget ? projectBuildKpi.kpiTarget : '--' }}</span>
              </li>
            </ul>
          </div>
        </div>
        <!-- 项目KPI -->
        <div
          class="project-kpi"
          v-if="
            projectClass == '30' &&
            projectAuditInfo.projectBuildKpiList != null &&
            projectAuditInfo.projectBuildKpiList.length > 0 &&
            projectAuditInfo.projectBuildKpiList.filter((item) => !item.baseType) &&
            projectAuditInfo.projectBuildKpiList.filter((item) => !item.baseType).length > 0
          "
        >
          <div class="info-title">
            <img src="@/assets/category-blue.png" alt="" />
            <span>业务KPI</span>
          </div>
          <div class="info-detail">
            <ul
              class="info-list"
              v-for="projectBuildKpi in projectAuditInfo.projectBuildKpiList.filter((item) => !item.baseType)"
              :key="'info-list-2_' + projectBuildKpi.id"
            >
              <li style="width: 25%">
                <img src="@/assets/dbcircle.png" alt="" />
                <span class="list-title">KPI描述：</span>
                <span>{{ projectBuildKpi.kpiDescribe ? projectBuildKpi.kpiDescribe : '--' }}</span>
              </li>
              <li style="width: 25%">
                <img src="@/assets/dbcircle.png" alt="" />
                <span class="list-title">达成目标：</span>
                <span>{{ projectBuildKpi.kpiTarget ? projectBuildKpi.kpiTarget : '--' }}</span>
              </li>
              <li style="width: 50%">
                <img src="@/assets/dbcircle.png" alt="" />
                <span class="list-title">说明：</span>
                <span>{{ projectBuildKpi.kpiExplain ? projectBuildKpi.kpiExplain : '--' }}</span>
              </li>
            </ul>
          </div>
        </div>
        <!-- 股东信息 -->
        <div
          class="project-kpi"
          v-if="
            projectClass == '64' &&
            projectAuditInfo.projectBuildCompany.mainPersonList != null &&
            projectAuditInfo.projectBuildCompany.mainPersonList.length > 0
          "
        >
          <div class="info-title">
            <img src="@/assets/category-blue.png" alt="" />
            <span>主要人员信息</span>
          </div>
          <div class="info-detail">
            <ul
              class="info-list"
              v-for="(projectBuildKpi, index) in projectAuditInfo.projectBuildCompany.mainPersonList"
              :key="'info-list-3_' + index"
            >
              <li style="width: 50%">
                <img src="@/assets/dbcircle.png" alt="" />
                <span class="list-title">职位：</span>
                <span>{{ projectBuildKpi.jobPositionName ? projectBuildKpi.jobPositionName : '--' }}</span>
              </li>
              <li style="width: 50%">
                <img src="@/assets/dbcircle.png" alt="" />
                <span class="list-title">姓名：</span>
                <span>{{ projectBuildKpi.fullName ? projectBuildKpi.fullName : '--' }}</span>
              </li>
            </ul>
          </div>
        </div>

        <div
          class="project-kpi"
          v-if="
            projectClass == '64' &&
            projectAuditInfo.projectBuildCompany.shareholderList != null &&
            projectAuditInfo.projectBuildCompany.shareholderList.length > 0
          "
        >
          <div class="info-title">
            <img src="@/assets/category-blue.png" alt="" />
            <span>{{
              projectAuditInfo.projectBuildCompany.newOrChange == '新建法人公司' ? '股东信息' : '变更事项'
            }}</span>
          </div>
          <div class="info-detail">
            <ul
              class="info-list md-info-list"
              v-for="(projectBuildKpi, index) in projectAuditInfo.projectBuildCompany.shareholderList"
              :key="'info-list-4_' + index"
            >
              <li style="width: 30%" v-if="projectAuditInfo.projectBuildCompany.newOrChange != '新建法人公司'">
                <img src="@/assets/dbcircle.png" alt="" />
                <span class="list-title">变更事项：</span>
                <span>{{ projectBuildKpi.changeOptionName ? projectBuildKpi.changeOptionName : '--' }}</span>
              </li>
              <li
                :style="{ width: projectAuditInfo.projectBuildCompany.newOrChange == '新建法人公司' ? '50%' : '30%' }"
              >
                <img src="@/assets/dbcircle.png" alt="" />
                <span class="list-title"
                  >{{
                    projectAuditInfo.projectBuildCompany.newOrChange == '新建法人公司' ? '股东' : '原登记内容'
                  }}：</span
                >
                <span>{{ projectBuildKpi.shareholder ? projectBuildKpi.shareholder : '--' }}</span>
              </li>
              <li
                :style="{ width: projectAuditInfo.projectBuildCompany.newOrChange == '新建法人公司' ? '50%' : '40%' }"
              >
                <img src="@/assets/dbcircle.png" alt="" />
                <span class="list-title"
                  >{{
                    projectAuditInfo.projectBuildCompany.newOrChange == '新建法人公司' ? '股权占比%' : '现登记内容'
                  }}：</span
                >
                <span>{{
                  projectAuditInfo.projectBuildCompany.newOrChange == '新建法人公司'
                    ? projectBuildKpi.ownershipRatio
                      ? projectBuildKpi.ownershipRatio
                      : '--'
                    : projectBuildKpi.newContent
                    ? projectBuildKpi.newContent
                    : '--'
                }}</span>
              </li>
            </ul>
          </div>
        </div>

        <!-- 投资项目相关方信息 -->
        <div
          class="project-kpi"
          v-if="
            projectClass == '50' &&
            projectAuditInfo.projectBuildInvest.investVOList != null &&
            projectAuditInfo.projectBuildInvest.investVOList.length > 0
          "
        >
          <div class="info-title">
            <img src="@/assets/category-blue.png" alt="" />
            <span>项目相关方</span>
          </div>
          <div class="info-detail">
            <ul
              class="info-list"
              v-for="(projectBuildKpi, index) in projectAuditInfo.projectBuildInvest.investVOList"
              :key="'info-list-5_' + index"
            >
              <li style="width: 50%">
                <img src="@/assets/dbcircle.png" alt="" />
                <span class="list-title">公司名称：</span>
                <span>{{ projectBuildKpi.companyName ? projectBuildKpi.companyName : '--' }}</span>
              </li>
              <li style="width: 50%">
                <img src="@/assets/dbcircle.png" alt="" />
                <span class="list-title">角色：</span>
                <span>{{ projectBuildKpi.companyName ? projectBuildKpi.role : '--' }}</span>
              </li>
            </ul>
          </div>
        </div>

        <!-- MG公司 -->
        <!-- <div
          class="project-kpi"
          v-if="
            projectClass == '62' &&
            projectAuditInfo.projectBuildMgTech.mgTechCompanyList != null &&
            projectAuditInfo.projectBuildMgTech.mgTechCompanyList.length > 0
          "
        >
          <div class="info-title">
            <img src="@/assets/category-blue.png" alt="" />
            <span>引进项目所属法人公司</span>
          </div>
          <div class="info-detail">
            <ul class="info-list" v-for="(projectBuildKpi,index) in projectAuditInfo.projectBuildMgTech.mgTechCompanyList" :key="index">
              <li style="width: 50%">
                <img src="@/assets/dbcircle.png" alt="" />
                <span class="list-title">公司编码：</span>
                <span>{{ projectBuildKpi.companyName ? projectBuildKpi.companyId : '--' }}</span>
              </li>
              <li style="width: 50%">
                <img src="@/assets/dbcircle.png" alt="" />
                <span class="list-title">公司名称：</span>
                <span>{{ projectBuildKpi.companyName ? projectBuildKpi.companyName : '--' }}</span>
              </li>
            </ul>
          </div>
        </div> -->
        <!-- 项目评定结果 -->
        <div class="project-results" v-if="(projectAuditInfo.hadCore || projectAuditInfo.hadXY) && projectAuditInfo.projectClass != '30' && projectClass !== '30'">
          <div class="info-title">
            <img src="@/assets/category-blue.png" alt="" />
            <span>项目评定结果</span>
          </div>
          <div class="info-detail">
            <ul class="info-list">
              <li>
                <span class="list-title">项目等级：</span>
                <span class="redfont">{{
                  projectAuditInfo.projectAuditLevel ? projectAuditInfo.projectAuditLevel : '--'
                }}</span>
              </li>
              <li>
                <span class="list-title">X创新绩点：</span>
                <span class="redfont borderleft"
                  >{{
                    projectAuditInfo.projectAuditGradePoint ? projectAuditInfo.projectAuditGradePoint : '--'
                  }}分</span
                >
              </li>
              <li>
                <span class="list-title">Y基本绩点：</span>
                <span class="redfont borderleft"
                  >{{
                    projectAuditInfo.projectAuditGradePointBasic ? projectAuditInfo.projectAuditGradePointBasic : '--'
                  }}分</span
                >
              </li>
              <li>
                <span class="list-title">核心力值：</span>
                <span class="redfont borderleft"
                  >{{
                    projectAuditInfo.projectAuditGradePointCore ? projectAuditInfo.projectAuditGradePointCore : '--'
                  }}分</span
                >
              </li>
            </ul>
          </div>
        </div>
        <!-- 项目时间进度计划 -->
        <div class="project-schedule">
          <div class="info-title">
            <img src="@/assets/category-blue.png" alt="" />
            <span>项目时间进度计划</span>
            <img src="@/assets/attention-red.png" alt="" />
            <span>项目子节点由项目经理制定报工人，无指定的报工人的，默认项目经理，副经理报工</span>
          </div>
          <a-table
            :columns="timeList"
            :data-source="projectAuditInfo.projectBuildTimeVOList"
            childrenColumnName="childrens"
            :rowKey="
              (record, index) => {
                return index
              }
            "
            :pagination="false"
            :indentSize="20"
            :expandIcon="expandIcon"
          >
            <template slot="timeNode" slot-scope="text, record">
              <span
                v-if="projectClass == '30' && text == '项目实施'"
                style="color: blue"
                @click="openTimeNode(text, record)"
                >{{ text }}</span
              >
              <span v-else>{{ text }}</span>
            </template>
            <template slot="addReportUserName" slot-scope="text, record">
              <span>{{ text ? text : record.reportStatus == 2 ? record.reportUserName : '' }}</span>
            </template>
            <template slot="reportStatus" slot-scope="text, record">
              <span v-if="text == 2" style="color: #5dec0e" @click="openTimeReportOn60(record)">{{ initReportStatusText(text) }}</span>
              <span v-else style="color: 'red'">{{ initReportStatusText(text) }}</span>
            </template>
          </a-table>
        </div>

        <!-- 项目预算 -->
        <div class="project-budget">
          <div class="info-title">
            <img src="@/assets/category-blue.png" alt="" />
            <span>项目预算</span>
          </div>
          <div class="budget-content" v-for="(i, v) in projectBuildBudgets" :key="'budget-content-0_' + v">
            <div class="budget-box">
              <div class="budget-title">
                费用支出方：<span class="fontblue">{{ i.factoryName ? i.factoryName : '--' }}</span> 金额：<span
                  class="fontred"
                  >{{ i.amounts ? i.amounts : '--' }}(万元不含税)</span
                >
              </div>
              <table style="width: 100%">
                <tbody>
                  <tr v-for="(buget, index1) in i.list" :key="'budget-list-0_' + index1 + '_' + buget">
                    <th
                      style="
                        width: 200px;
                        border-bottom: 1px solid #fff;
                        background-color: #dadee9;
                        padding: 10px 0;
                        text-align: center;
                        word-break: break-word;
                      "
                    >
                      {{ buget.budgetItem }}（万元）
                    </th>
                    <td
                      style="
                        width: 200px;
                        border-bottom: 1px solid #f5f5f5;
                        background-color: #fff;
                        padding: 10px 0;
                        text-align: center;
                        word-break: break-word;
                      "
                    >
                      {{ buget.amount ? buget.amount : '--' }}
                    </td>
                    <th
                      style="
                        width: 150px;
                        border-bottom: 1px solid #fff;
                        background-color: #dadee9;
                        padding: 10px 0;
                        text-align: center;
                        word-break: break-word;
                      "
                    >
                      说明
                    </th>
                    <td
                      style="
                        width: calc(100% - 550px);
                        border-bottom: 1px solid #f5f5f5;
                        background-color: #fff;
                        padding: 10px 10px 10px 30px;
                        word-break: break-word;
                      "
                    >
                      {{ buget.memo ? buget.memo : '--' }}
                    </td>
                  </tr>
                </tbody>
              </table>
            </div>
          </div>
        </div>
        <!--项目验收指标-->
        <project-complete-accept-target
          v-if="projectClass == '40'"
          :projectBuildId="projectBuildId"
          :editable="false"
        />
        <!-- 项目审批意见 -->
        <div class="approval-opinion" v-if="processInstanceId && processInstanceId !== ''">
          <div class="info-title">
            <img src="@/assets/category-blue.png" alt="" />
            <span>项目审批意见</span>
          </div>
          <div class="process-engine" v-if="loadProcess">
            <ht-approval
              ref="childrenRef"
              :process-instance-id="processInstanceId"
              :options="options"
              :custom="custom"
              @submit="afterSubmit"
              @reject="afterReject"
              @back="backAction"
              @cancelSubmit="afterCancelSubmit"
              :before-fill-opinion="saveNotifyOpinion"
              :before-submit="beforeSubmit"
              :before-reject="beforeReject"
              :show-task-history="true"
              :history-dialog="historyDialog"
              :task-load="taskLoad"
              :message-id="messageId"
              :showPrintBtn="showPrintBtn"
              :show-upload-btn="false"
              :return-revert-node-flag="projectClass == '30'?1:0"
              :snapshotConfigs="snapshotConfigs"
              :print="print"
            >
            </ht-approval>
            <!-- <GcApprovalTips v-if="projectClass==40 && projectType !='S' "/> -->
          </div>
        </div>
      </div>
      <div v-if="projectAuditInfo.hadXY" class="project-container" v-show="pageId == 2">
        <questionnaire-audit-page :parentProjectBuildId="projectBuildId"></questionnaire-audit-page>
      </div>
      <div v-if="projectAuditInfo.hadCore" class="project-container" v-show="pageId == 3">
        <questionnaire-core-audit-page :parentProjectBuildId="projectBuildId"></questionnaire-core-audit-page>
      </div>
      <div class="project-container" v-show="pageId == 4">
        <team-form :view-type="viewType" />
      </div>
      <div class="project-container" v-show="pageId == 5">
        <div class="attachment-detail">
          <attach-page />
        </div>
      </div>
      <div
        class="project-container"
        v-if="projectAuditInfo.projectBuildMeets != null && projectAuditInfo.projectBuildMeets.length > 0"
        v-show="pageId == 6"
      >
        <meeting-results :view-type="viewType" />
      </div>

      <ul class="floatNav" v-show="floatNavShow">
        <li :class="{ clickShow: pageId == 1 }" @click="handleToggle(1)">项目概述</li>
        <li v-if="projectAuditInfo.hadXY" :class="{ clickShow: pageId == 2 }" @click="handleToggle(2)">价值表</li>
        <li v-if="projectAuditInfo.hadCore" :class="{ clickShow: pageId == 3 }" @click="handleToggle(3)">核心力值</li>
        <li :class="{ clickShow: pageId == 4 }" @click="handleToggle(4)">团队表</li>
        <li :class="{ clickShow: pageId == 5 }" @click="handleToggle(5)">附件</li>
        <li
          v-if="projectAuditInfo.projectBuildMeets != null && projectAuditInfo.projectBuildMeets.length > 0"
          :class="{ clickShow: pageId == 6 }"
          @click="handleToggle(6)"
        >
          上会结果
        </li>
        <li v-if="outShowPrintBtn" @click="print()">打印</li>
        <!-- <li  v-print="'.project-summary'" title="vue-print-nb-jeecg" v-if="outShowPrintBtn && projectAuditInfo.projectBuild.projectType == 'MC'">打印</li> -->
        <li v-if="isCanEdit === '1'" @click="handleEdit()">编辑</li>
        <li v-if="['40','41'].includes(projectBuild.projectClass)" @click="fileJoinSignAdd()">会审</li>
        <!-- <li v-if="['GA','GB','GC','GD','GE','GF'].indexOf(projectAuditInfo.projectBuild.projectType)>-1 && projectAuditInfo.projectBuild.status >= 4" @click="toChangeRecordList">工程变更</li> -->
        <li v-if="projectAuditInfo.projectBuild.status >= 4 && projectClass == '30' && checkManagerAndSubAdmin()" @click="gotoItAdjustIndex">质量单</li>
        <!-- <li v-if="['40','41'].indexOf(projectClass) >-1" @click="gotoPurchaseList">采购申请</li>
        <li v-has="'rewardList:40'" v-if="['GA','GB','GC','GD','GE','GF'].indexOf(projectAuditInfo.projectBuild.projectType)>-1" @click="gotoLink('/reward/applyList')">工程奖励</li> -->
        <!-- <li v-if="projectAuditInfo.projectBuild.status >= 4 && checkManagerAndSubAdmin()" @click="gotoItTaskReportIndex">迭代任务</li> -->
        <li v-if="projectClass=='30' " @click="handlePraise">口碑</li>
        <li v-if="projectDoneShow()" @click="handleProjectDone">项目归档</li>
        <!-- 概算 -->
        <li @click="showEngineeBudget">概算</li>
      </ul>
    </div>
    <a-back-top style="right: 50px" />

    <!-- 工程预算表 -->
    <a-modal 
        title="工程项目预算表"
        :width="1800"
        :visible="engineeBudget"
        @cancel="engineeBudgetClose()"
        @ok="engineeBudgetOk()">
          <EngineeBudget :projectBuildId="projectBuildId" 
          :projectNo="projectBuild.projectNo" 
          :projectName="projectBuild.projectName"
          :canEditPage="false"  ref="engineeBudgetRef"/>
    </a-modal>
    
    <a-modal
      title="项目变更历史记录"
      :visible="showHistoryList"
      @ok="showHistoryList = false"
      @cancel="showHistoryList = false"
      width="80vw"
      :height="800"
      :destroyOnClose="true"
    >
      <change-history-list :projectBuildId="projectBuildId"></change-history-list>
    </a-modal>

    <task-list-by-approval-time-node ref="taskListByApprovalTimeNode"></task-list-by-approval-time-node>
    <ProcessUserSelect40 @selectUserConfirm="selectUserConfirm40" ref="processUserSelect40" />
    <a-modal
      title="项目信息打印"
      :visible="printModalShowFlag"
      @ok="printModalShowFlag = false"
      @cancel="printModalShowFlag = false"
      width="98%"
      wrap-class-name="full-modal"
      :destroyOnClose="true"
      :footer="null"
      :key="printKey"
    >
      <project-build-basic-print :projectAuditInfo="projectAuditInfo" :freshKey="printKey"></project-build-basic-print>
    </a-modal>
    <a-modal title="技术会审记录" :visible="fileJoinSign.showHistoryList" @ok="fileJoinSign.showHistoryList = false"
      @cancel="fileJoinSign.showHistoryList = false" width="80vw" height="80vh" :destroyOnClose="true">
      <!-- <div style="margin-bottom: 5px">
        <a-button type="primary" @click="addFileJoinSign" style="margin-right: 10px">
          <a-icon type="plus-circle" />新增
        </a-button>
        <a-button @click="delFileJoinSign">
          <a-icon type="select" />删除
        </a-button>
      </div> -->
      <a-table :columns="fileJoinSign.historyCols" :data-source="fileJoinSign.historyData"
        :scroll="{ x: true }" bordered :pagination="false" rowKey="id" >
        <template slot="billNo" slot-scope="text, record">
          <a @click="openFileJoinSignAdd(record.billNo)">{{ record.billNo }}</a>
        </template>
        <template slot="status" slot-scope="text">
          {{ text == '1' ? '审批不通过' : (text == '2' ? '审批完成' : (text == '3' ? '创建中' : '审批中'))}}
        </template>
      </a-table>
    </a-modal>
  </div>
</template>
<script>
import Vue from 'vue'
import '@/config/upload.install.js'
import { getAction, getActionAsync, postAction,previewAttach } from '@/api/manage'
import { ACCESS_TOKEN,USER_INFO, USER_NAME } from '@/store/mutation-types'
import { getParamValFromUrl, caseToShow } from '@/utils/common.js'
export default {
  components: {
    htApproval: () => import('@/config/ht-approval.umd.min.js'),
    HomeNav: () => import('@/components/layouts/HomeNav'),
    QuestionnaireAuditPage: () => import('@/components/tools/projectBuild/QuestionnaireAuditPage'),
    QuestionnaireCoreAuditPage: () => import('@/components/tools/projectBuild/QuestionnaireCoreAuditPage'),
    ProjectBuildBasicShow: () => import('@/components/tools/projectBuild/ProjectBuildBasicShow'),
    TeamForm: () => import('@/views/projectBuildStup/TeamForm'),
    AttachPage: () => import('@/views/projectBuildStup/AttachPage'),
    MeetingResults: () => import('@/views/projectBuildStup/MeetingResults'),
    ProcessMeetSelect: () => import('@/components/tools/projectBuildStup/ProcessMeetSelect'),
    GcApprovalTips: () => import('@/views/approval/GcApprovalTips'),
    ChangeHistoryList: () => import('@/components/tools/projectBuild/ChangeHistoryList'),
    TaskListByApprovalTimeNode: () => import('@/components/tools/taskListByApprovalTimeNode'),
    ProjectCompleteAcceptTarget: () => import('@/components/tools/projectBuildStup/ProjectCompleteAcceptTarget'),
    ProcessUserSelect40: () => import('@/components/tools/ProcessUserSelect'),
    ProjectBuildBasicPrint: () => import('@/views/projectBuild/projectPrint/ProjectBuildBasicPrint'),
    EngineeBudget: () => import('@/components/tools/project/EngineeBudget')
  },
  data() {
    return {
      engineeBudget:false,
      viewType: 'approval',
      pageId: 1,
      loadProcess: false,
      floatNavShow: false,
      showHistoryList: false,
      loading: false,
      url: {
        getProjectAuditById: '/projectBuildAudit/getProjectAuditById',
        auditProjectPass: '/projectBuildAudit/auditProjectPass',
        auditProjectNotPass: '/projectBuildAudit/auditProjectNotPass',
        auditProjectBack: '/projectBuildAudit/auditProjectBack',
        auditProjectCancel: '/projectBuildAudit/auditProjectCancel',
        getAttachesList: '/tp/attach/getAttaches',
        getMangerAndAuditUser: '/projectBuildAudit/getMangerAndAuditUser',
        totalBudget: '/projectBuildAudit/totalBudget',
        checkProjectBuildIsCanEdit: '/projectBuildAudit/checkProjectBuildIsCanEdit',
        getProjectLevel: '/projectBuildAudit/getProjectLevel',
        createProjectBuildMeet: '/projectBuild/projectBuildMeet/createProjectBuildMeet',
        codeInfoList: '/manage/codeInfo/list',
        publishEngineProject: '/projectBuild/publishEngineProject',
        calFlowNode40: '/projectBuild/calFlowNode40',
        jugeDate:'/projectMemberEvaluate/jugeDate' ,
        updateSubmitParams: '/projectBuild/updateSubmitParams',
        saveEngineeBudget:'/projectBudgetEnginee/save',
      },
      projectBuildId: '',
      projectClass: '',
      projectType: '',
      projectAuditInfo: {
        projectBuild: {
          projectClass: '0',
        },
      },
      projectBuild: {},
      projectBuildBudgets: [],
      timeList: [
        {
          title: '项目关键节点',
          width: '20%',
          align: 'left',
          dataIndex: 'timeNode',
          key: 'timeNode',
          scopedSlots: { customRender: 'timeNode' },
        },
        { title: '主要完成内容', width: '30%', align: 'center', dataIndex: 'jobContent', key: 'jobContent' },
        //  { title: '计划开始时间', width: '15%', align: 'center', dataIndex: 'planStartDate', key: 'planStartDate' },
        { title: '计划完成时间', width: '15%', align: 'center', dataIndex: 'completionDate', key: 'completionDate' },
        {
          title: '实际完成时间',
          width: '15%',
          align: 'center',
          dataIndex: 'realCompletionDate',
          key: 'realCompletionDate',
        },
        {
          title: '报工人',
          width: '10%',
          align: 'center',
          dataIndex: 'addReportUserName',
          key: 'addReportUserName',
          scopedSlots: { customRender: 'addReportUserName' },
        },
        {
          title: '报工状态',
          width: '10%',
          align: 'center',
          dataIndex: 'reportStatus',
          key: 'reportStatus',
          scopedSlots: { customRender: 'reportStatus' },
        },
      ],
      timeListNo30: [
        {
          title: '项目关键节点',
          width: '20%',
          align: 'left',
          dataIndex: 'timeNode',
          key: 'timeNode',
          scopedSlots: { customRender: 'timeNode' },
        },
        { title: '主要完成内容', width: '30%', align: 'center', dataIndex: 'jobContent', key: 'jobContent' },
        { title: '计划开始时间', width: '10%', align: 'center', dataIndex: 'planStartDate', key: 'planStartDate' },
        { title: '计划完成时间', width: '10%', align: 'center', dataIndex: 'completionDate', key: 'completionDate' },
        {
          title: '实际完成时间',
          width: '10%',
          align: 'center',
          dataIndex: 'realCompletionDate',
          key: 'realCompletionDate',
        },
        {
          title: '报工人',
          width: '10%',
          align: 'center',
          dataIndex: 'addReportUserName',
          key: 'addReportUserName',
          scopedSlots: { customRender: 'addReportUserName' },
        },
        {
          title: '报工状态',
          width: '10%',
          align: 'center',
          dataIndex: 'reportStatus',
          key: 'reportStatus',
          scopedSlots: { customRender: 'reportStatus' },
        },
      ],
      tabPosition: 'top',
      tabBarStyle: {},
      isOld:true ,
      attachmentColumns: [
        {
          title: '附件名称',
          dataIndex: 'fileName',
          width: '55%',
        },
        {
          title: '上传人',
          dataIndex: 'uploaderName',
          width: '15%',
          align: 'center',
        },
        {
          title: '上传时间',
          dataIndex: 'uploadTime',
          width: '15%',
          align: 'center',
        },
        {
          title: '文件大小',
          dataIndex: 'size',
          width: '15%',
          align: 'center',
        },
        { title: '操作', dataIndex: 'url', width: '10%', scopedSlots: { customRender: 'toAttach' } },
      ],
      attachmentData: [],
      innerdata: [],
      expandedRowKeys: [],
      userinfo: {
        info: this.$store.getters.userInfo,
        module: 'approval',
      },
      options: {
        request: {
          baseUrl: this.API_BASE_URL, // 业务系统根路径
          timeOut: 10000, // 请求超时时间
          interceptors: (config) => {
            config.headers['X-Access-Token'] = Vue.ls.get(ACCESS_TOKEN)
            return config
          },
        },
        userId: Vue.ls.get(USER_NAME),
      },
      taskType: 0, // 任务类型，默认0：待办任务，1：抄送任务，2：已办任务
      processInstanceId: '',
      returnShowConfirm: false, // 退回显示确认框
      messageId: '', // 工作台URL里面的msgId参数
      showPrintBtn: false,
      outShowPrintBtn: false,
      custom: {
        // budgetAmount: 0,
      },
      historyDialog: {
        // 审批历史模态框属性
      },
      //选人弹窗参数
      userSel: {
        tabUrl: '/upms/user/selUserList',
        title: '请选择技术会审人员',
        visible: false,
        confirmLoading: true,
        keyword: '',
        colums: [
          {
            title: '登录账号',
            dataIndex: 'username',
            align: 'center',
            scopedSlots: { customRender: 'username' },
          },
          {
            title: '真实姓名',
            dataIndex: 'realname',
            align: 'center',
          },
          {
            title: '部门',
            dataIndex: 'orgCodeTxt',
            align: 'center',
          },
        ],
        data: [],
        freshKey: 0,
        selIds: [],
        selRows: [],
      },
      mangerAndAuditUser: {},
      isCanEdit: '0',
      projectStatus:'0',
      toMeetVisible: false,
      confirmMeetVisible: false,
      selMeetCols: [
        {
          label: '选择预计上会人员',
          field: 'estimateMeetPerson',
          username: '',
          realname: '',
          required: true,
          min: 1,
          msg: '至少选择3位主管上会评审，其中至少选择一名技术专业委成员',
        },
      ],
      basicFreshKey: 0,
      snapshotConfigs: [
        {
          type: 'ref',
          value: 'imageWrapper',
        },
      ],
      reportStatusColor: {},
      timeNodeColor: {},
      techColumns: [
        {
          title: '维度',
          dataIndex: 'dimension',
          width: '33%',
          align: 'center',
          scopedSlots: { customRender: 'dimension' },
        },
        {
          title: '目标',
          dataIndex: 'projectTarget',
          align: 'center',
          width: '33%',
          scopedSlots: { customRender: 'projectTarget' },
        },
        {
          title: '取数依据',
          dataIndex: 'basisData',
          align: 'center',
          scopedSlots: { customRender: 'basisData' },
          width: '34%',
        },
      ],
      knowledgeColumns: [
        {
          title: '知产成果类型',
          dataIndex: 'dimension',
          width: '33%',
          align: 'center',
          scopedSlots: { customRender: 'dimension' },
        },
        {
          title: '目标数量',
          dataIndex: 'projectTarget',
          width: '33%',
          align: 'center',
          scopedSlots: { customRender: 'projectTarget' },
        },
        {
          title: '备注说明',
          dataIndex: 'basisData',
          width: '33%',
          align: 'center',
          scopedSlots: { customRender: 'basisData' },
        }
      ],
      printModalShowFlag: false,
      printKey: 1,
      hiddenTaskDefKey:"submit",
      fileJoinSign: {
        projectBuildId: '',
        projectNo: '',
        projectName: '',
        showHistoryList: false,
        historyCols: [
          { title: '状态', width: '120px', align: 'center', dataIndex: 'status', key: 'status',scopedSlots: { customRender: 'status' }},
          {
            title: '会审单号',
            width: '150px',
            align: 'left',
            dataIndex: 'billNo',
            key: 'billNo',
            scopedSlots: { customRender: 'billNo' },
          },
          { title: '会审标题', align: 'center', dataIndex: 'fileTitle', key: 'fileTitle' },
          { title: '文件类型', align: 'center', dataIndex: 'fileTypeName', key: 'fileTypeName' },
          { title: '申请人', width: '100px', align: 'center', dataIndex: 'createUserName', key: 'createUserName' },
          { title: '申请时间', width: '200px', align: 'center', dataIndex: 'createDate', key: 'createDate' }
        ],
        historyData: [],
      },
      engineeBudgetData:[],
    }
  },
  mounted() {
    window.addEventListener('scroll', this.handleScroll)
    this.projectBuildId = getParamValFromUrl('projectBuildId')
    this.messageId = getParamValFromUrl('messageId')
    this.jugeDate()
    this.getProjectAudit()
    this.fetchMangerAndAuditUser()
    this.getTotalBudget()
    this.getProjectLevel()
    this.checkProjectBuildIsCanEdit()
  },
  computed: {
    userSelRowSelection() {
      return {
        onChange: (selectedRowKeys, selectedRows) => {
          this.userSel.selIds = selectedRowKeys
          this.userSel.selRows = selectedRows
        },
      }
    }
  },
  methods: {
    showEngineeBudget(){
      this.engineeBudget=true;
    },

    engineeBudgetOk(){
      this.engineeBudgetData = this.$refs.engineeBudgetRef.getCurrentTableList()
      
      console.log('this.projectBuildId:',this.projectBuildId)
      if(this.engineeBudgetData && this.engineeBudgetData.length > 0){
        this.engineeBudgetData.forEach(item =>{
          if(item.strId && !item.strId.startsWith('add')){
            item.id = item.strId
          }else{
            item.projectBuildId = this.projectBuildId;
          }
        })
        console.log('engineeBudgetData:',JSON.stringify(this.engineeBudgetData))
        postAction(this.url.saveEngineeBudget,this.engineeBudgetData).then((res)=>{
          if(res.code == 200){
            console.log('保存成功')
            
          }
        })
      }

      this.engineeBudget=false;
      window.location.reload()
      
    },

    engineeBudgetClose(){
      this.engineeBudget=false;
      window.location.reload()
    },

    needMeet() {
      this.confirmMeetVisible = false
      this.$refs.processMeetConfirm.doSelect()
    },
    selectMeetConfirm(cols) {
      var data = { projectBuildId: this.projectBuild.id, timeNodeCode: '1', needMeetReason: '' }
      cols.forEach((col) => {
        data[col.field] = col.realname
      })
      var vm = this
      postAction(this.url.createProjectBuildMeet, data)
        .then((res) => {
          if (res.code == 200) {
            this.projectAuditInfo.projectBuildMeets = [res.result]
            vm.$message.success('保存上会成功', 1)
            vm.$refs.childrenRef.submitTaskNotBefore()
          } else {
            vm.$message.warning('保存数据出错:' + res.message)
          }
        })
        .catch((res) => {
          this.$message.warning('保存数据出错:' + res.message)
        })
      return flag
    },
    notNeedMeet(onlyClose) {
      this.confirmMeetVisible = false
      if (!onlyClose) {
        this.$refs.childrenRef.submitTaskNotBefore()
      }
    },
    handlePraise(){
      let urlJump = this.$router.resolve({ path: '/evaluateList?projectBuildId='+this.projectBuildId })
      window.open(urlJump.href, '_blank')

    },
    toMeetOk() {
      this.toMeetVisible = false
      this.handleToggle(6)
    },
    getProjectAudit() {
      var vm = this
      getAction(vm.url.getProjectAuditById, { projectBuildId: vm.projectBuildId }).then((res) => {
        if (res.code == 200) {
          vm.projectAuditInfo = res.result || {}
          vm.projectBuild = vm.projectAuditInfo.projectBuild
          vm.processInstanceId = vm.projectBuild.processInstanceId
          vm.projectClass = vm.projectBuild.projectClass
          vm.projectType = vm.projectBuild.projectTypeSubCategory
          if (vm.projectClass != '30') {
            vm.timeList = vm.timeListNo30
          }
          vm.initProjectBuildBudget()
          vm.loadProcess = true
          vm.setAttaches()
          vm.initSubName()
          if ( ['10','30','40','41','61','63','64'].includes(this.projectClass) || (this.projectClass == '62' && this.projectType != 'MG')) {
            this.outShowPrintBtn = true
          }
        } else {
          vm.$message.warning('加载审批基本信息失败：' + res.message)
        }
      })
    },
    print() {

      if (this.projectClass == '40') {
        window.open(
          this.API_BASE_URL +
            '/projectBuildAudit/printInfo?id=' +
            this.projectBuildId +
            '&token=' +
            Vue.ls.get(ACCESS_TOKEN)
        )
      } else if (this.projectClass == '41') {
        window.open(
          this.API_BASE_URL +
            '/projectBuildAudit/printInfoGf?id=' +
            this.projectBuildId +
            '&token=' +
            Vue.ls.get(ACCESS_TOKEN)
        )
      } else if (this.projectClass == '64') {
        window.open(
          this.API_BASE_URL +
            '/projectBuildAudit/printInfoCompany?id=' +
            this.projectBuildId +
            '&token=' +
            Vue.ls.get(ACCESS_TOKEN)
        )
      } else if (this.projectClass == '62') {
        this.printModalShowFlag = true;
        ++this.printKey
      } else if (['61','63'].includes(this.projectClass)) {
        window.open(
          this.API_BASE_URL +
            '/projectBuildAudit/printInfoManage?id=' +
            this.projectBuildId +
            '&projectClass=' +
            this.projectClass +
            '&token=' +
            Vue.ls.get(ACCESS_TOKEN)
        )
      } else if (this.projectClass == '10') {
        window.open(
          this.API_BASE_URL +
            '/projectBuildAudit/printInfoTechnology?id=' +
            this.projectBuildId +
            '&token=' +
            Vue.ls.get(ACCESS_TOKEN)
        )
      } else if (this.projectClass == '30') {
        window.open(
          this.API_BASE_URL +
            '/projectBuildAudit/printInfoMation?id=' +
            this.projectBuildId +
            '&token=' +
            Vue.ls.get(ACCESS_TOKEN)
        )
      }
    },
    initProjectBuildBudget() {
      var vm = this
      vm.projectBuildBudgets = []
      if (vm.projectAuditInfo.projectBuildBudgetList != null) {
        vm.projectAuditInfo.projectBuildBudgetList.forEach((budget) => {
          var flag = true
          if (vm.projectAuditInfo.projectBuild.status > 1 && budget.auditAmount != null) {
            budget.amount = budget.auditAmount
            budget.memo = budget.auditMemo
          }
          vm.projectBuildBudgets.forEach((pBudget) => {
            if (budget.factoryName == pBudget.factoryName) {
              var amounts = parseFloat(pBudget.amounts) + parseFloat(budget.amount)
              pBudget.amounts = amounts.toFixed(2)
              pBudget.list.push(budget)
              flag = false
            }
          })
          if (flag) {
            vm.projectBuildBudgets.push({
              factoryName: budget.factoryName,
              amounts: budget.amount,
              list: [budget],
            })
          }
        })
      }
    },
    initSubName() {
      var vm = this
      getAction(this.url.codeInfoList, {
        type: '项目子类',
        isdel: 0,
        parentid: vm.projectBuild.projectClass,
        code: vm.projectBuild.projectType,
      })
        .then((res) => {
          if (res.code == 200) {
            var list = res.result
            if (list != null) {
              vm.projectAuditInfo.projectBuild.subName = list.records[0].name
              vm.basicFreshKey++
            }
          } else {
            this.$message.warning('加载项目子类展示出错:' + res.message)
          }
        })
        .catch((res) => {
          this.$message.warning('加载项目子类展示异常:' + res.message)
        })
    },
    caseToShow(obj) {
      return caseToShow(obj)
    },
    previewAttach(record) {
      if (
        !this.mangerAndAuditUser.isManager &&
        !this.mangerAndAuditUser.isAuditor &&
        !this.mangerAndAuditUser.downAndView
      ) {
        return this.$message.warning('您没有权限查看附件')
      }
      var uploaderName = record.uploaderName
      console.log('uploaderName:' + uploaderName + 'id:' + record.id)

      let params={
        id:record.id,
        ftpKey:'ftp'
      };
      previewAttach(params).then(result=>{
        const url=URL.createObjectURL(result)
        if (this.projectBuild.projectClass == '40' || this.projectBuild.projectClass == '61') {
          window.open(process.env.BASE_URL+'/pdf/web/normalViewer.html?file=' + url)
        } else {
          window.open(process.env.BASE_URL+'/pdf/web/viewer.html?file=' + url)
        }
      }).catch(err => {
        this.$message.warning('下载文件失败');
      })
    },
    handleScroll() {
      //获取滚动时的高度
      let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
      //
      // console.log(scrollTop)
      if (scrollTop > 227) {
        //大于200的时候要做的操作
        this.floatNavShow = true
        // this.tabPosition='right'
        // this.tabBarStyle={
        //   position: 'fixed',
        //   height: 'auto',
        //   right: '30px',
        // }
      } else {
        // this.tabPosition='top'
        // this.tabBarStyle={
        //   position: 'unset',
        //   height: 'auto',
        //   right: 'unset',
        // }
        this.floatNavShow = false
      }
    },
    setAttaches() {
      this.attachmentData = []
      var attaches = this.projectAuditInfo.attaches
      if (attaches != null) {
        attaches.forEach((item) => {
          item.size = (parseInt(item.size) / 1024).toFixed(2) + 'KB'
          this.attachmentData.push(item)
        })
      }
    },
    expandIcon(props) {
      if (Array.isArray(props.record.childrens) && props.record.childrens != 0) {
        if (props.expanded) {
          //有数据-展开时候图标
          return (
            <a
              style="color: 'black',margin-right:0px"
              onClick={(e) => {
                props.onExpand(props.record, e)
              }}
            >
              <a-icon type="caret-down" style="color:#53baa7" />
            </a>
          )
        } else {
          //有数据-未展开时候图标
          return (
            <a
              style="color: 'black' ,margin-right:0px"
              onClick={(e) => {
                props.onExpand(props.record, e)
              }}
            >
              <a-icon type="caret-down" style="color:#53baa7" />
            </a>
          )
        }
      } else {
        //无数据-图标
        return <span style="margin-right:0px"></span>
      }
    },
    jugeDate(){
        getAction(this.url.jugeDate , {projectBuildId: this.projectBuildId}).then( res => {
          debugger
          if (res.code == 200){
            this.isOld = false;
          }
          else {
            this.isOld = true;
          }
        })
    },
    checkFlowNode() {
      let vm = this
      getAction(vm.url.calFlowNode40 + '?projectId=' + vm.projectBuild.id).then((res) => {
        if (res.success) {
          vm.$refs.processUserSelect40.doSelect(res.result.fields, res.result.tips)
        } else {
          vm.$message.error('获取工程类立项流程节点信息失败:' + res.message)
        }
      })
    },
    selectUserConfirm40(cols) {
      if (cols && cols.length > 0) {
        postAction(this.url.updateSubmitParams + '?projectId=' + this.projectBuild.id, cols).then((res) => {
          if (res.success) {
            let params = []
            for (let col of cols) {
              let param = {}
              param.field = col.node
              param.username = col.value
              params.push(param)
            }
            this.selectUserConfirm(params)
          } else {
            return this.$message.error('更新提交审批参数错误:' + res.message)
          }
        })
      }
    },
    selectUserConfirm(cols) {
      if (cols != null && cols.length > 0) {
        var data = {}
        cols.forEach((item) => {
          var key = item.field
          data[key] = item.username
        })
        let vm = this
        //参数组装完毕，发起流程
        postAction(this.url.publishEngineProject, { id: this.projectBuild.id, approvalPerson: data })
          .then((res) => {
            if (res.code == 200) {
              this.canEdit = false
              this.submitAndDel = false
              this.$message.success('提交成功')
              this.$router.go(0)
            } else {
              this.$message.warning('提交失败:' + res.message)
            }
          })
          .catch((res) => {
            this.$message.warning('提交异常:' + res.message)
          })
      } else {
        this.$message.warning('未选中操作员')
      }
    },
    //-------------流程回调------start
    beforeSubmit(res) {
      if (this.checkOptionValue()) {
        var taskDefKey = this.currentTask.taskDefKey
        if (this.currentTask.lastAssignee) {
          //科技/工程类检测上会审批状态
          if ((this.projectClass === '10' || this.projectClass === '40') && taskDefKey === 'projectManager') {
            if (!this.projectAuditInfo.meetPassed) {
              this.toMeetVisible = true
              return false
            }
          }
          if (this.projectClass === '30' && taskDefKey === 'projectManager') {
            if (!this.projectAuditInfo.meetPassed) {
              this.toMeetVisible = true
              return false
            }
          }
        }
        if ((this.projectClass === '40' || this.projectClass === '41') && this.projectBuild.projectTypeSubCategory != 'S' && ["projectManager","submit"].indexOf(taskDefKey)>-1) {
          this.checkFlowNode()
          return false
        }
      }
      this.getTotalBudget()
      this.getProjectLevel()
      this.$refs.childrenRef.custom = this.custom
      //院长审批选择是否需要上会
      if (
        this.projectClass === '10' &&
        taskDefKey === 'president' &&
        (this.projectAuditInfo.projectBuildMeets == null || this.projectAuditInfo.projectBuildMeets.length < 1)
      ) {
        this.confirmMeetVisible = true
        return false
      }
      return true
    },
    afterSubmit(res) {
      if (this.doAuditProjectPass()) {
        this.fetchMangerAndAuditUser()
        this.getTotalBudget()
        this.$router.go(0)
        return true
      } else {
        return false
      }
    },
    beforeReject(res) {
      // 驳回前置动作
      if (this.checkOptionValue()) {
        if (this.doAuditProjectNotPass()) {
          return true
        } else {
          return false
        }
      } else {
        return false
      }
    },
    afterReject(res) {
      // 用户点击驳回后成功返回后的处理
    },
    backAction(res) {
      var backKey = this.$refs.childrenRef.currentNode.TASK_DEF_KEY_
      if (this.doAuditProjectBack(backKey)) {
        this.$message({
          message: '退回成功',
          type: 'success',
        })
        this.$router.go(0)
      }
    },
    //撤回后
    afterCancelSubmit() {
      if (this.doAuditProjectCancel()) {
        this.$message.success('撤回成功')
        this.$router.go(0)
      }
    },
    // 生成抄送任务方法，非必须
    sendNotify() {
      // 参数一：抄送人，参数二：工作台打开详情链接
      this.$refs.childrenRef.saveBpmNotify('liangyh', 'http://xxxxx.com')
    },
    saveNotifyOpinion() {
      // 保存抄送意见前置动作
      return true
    },
    attachPreview(file) {
      // 附件预览回调函数
    },
    customTaskHistory(data) {
      // 自定义审批历史函数，show-task-history设置成true显示审批历史按钮，data：审批历史数据
    },
    taskLoad(task) {
      // 当前任务加载回调函数，获取当前任务信息
      this.currentTask = task
      // if(this.currentTask.taskDefKey=='apply'){
      //   this.hiddenTaskDefKey='apply'
      // }
      // if (this.projectClass == '40' && 'president' === this.currentTask.taskDefKey) {
      //   this.showPrintBtn = true
      // } else if (this.projectClass == '64' && 'groupAudit' === this.currentTask.taskDefKey) {
      //   this.showPrintBtn = true
      // } else if (
      //   (this.projectClass == '60' ||
      //     this.projectClass == '61' ||
      //     this.projectClass == '62' ||
      //     this.projectClass == '63') &&
      //   'president' === this.currentTask.taskDefKey
      // ) {
      //   this.showPrintBtn = true
      // } else {
      //   this.showPrintBtn = false
      // }
    },
    //-------------流程回调------end
    async doAuditProjectPass() {
      var flag = false
      await getActionAsync(this.url.auditProjectPass, { projectBuildId: this.projectBuildId }).then((res) => {
        if (res.code == 200) {
          flag = true
        } else {
          this.$message.warning('流程审批通过接口异常:' + res.message)
        }
      })
      return flag
    },
    async doAuditProjectNotPass() {
      var flag = false
      await getActionAsync(this.url.auditProjectNotPass, { projectBuildId: this.projectBuildId }).then((res) => {
        if (res.code == 200) {
          flag = true
        } else {
          this.$message.warning('流程审批不通过接口异常:' + res.message)
        }
      })
      return flag
    },
    async doAuditProjectBack(backKey) {
      var flag = false
      await getActionAsync(this.url.auditProjectBack, { projectBuildId: this.projectBuildId, backKey: backKey }).then(
        (res) => {
          if (res.code == 200) {
            flag = true
          } else {
            this.$message.warning('流程审批退回接口异常:' + res.message)
          }
        }
      )
      return flag
    },
    async doAuditProjectCancel() {
      var flag = false
      await getActionAsync(this.url.auditProjectCancel, { projectBuildId: this.projectBuildId }).then((res) => {
        if (res.code == 200) {
          flag = true
        } else {
          this.$message.warning('流程审批退回接口异常:' + res.message)
        }
      })
      return flag
    },
    checkOptionValue() {
      var options = this.$refs.childrenRef.data
      if (options == '' || options == null || options == undefined) {
        // this.$message.warning('审批意见不能为空', 3000)
        return false
      } else {
        return true
      }
    },
    userSelHandleOk() {},
    userSelHandleCancel() {},
    userSelSearch() {
      getAction(this.userSel.tabUrl, { pageSize: 10000, keyword: this.userSel.keyword }).then((res) => {
        if (res.success) {
          this.userSel.data = res.result.records
        } else {
          this.$message.warning('用户选择数据加载失败:' + res.message)
        }
      })
    },
    handleToggle(index) {
      if (index == 1) {
        this.getProjectAudit()
      }
      this.pageId = index
      // 滚动条滚动到顶部
      this.$nextTick(() => {
        this.$refs.imageWrapper.scrollIntoView()
      })
    },
    fetchMangerAndAuditUser() {
      getAction(this.url.getMangerAndAuditUser, { id: this.projectBuildId }).then((res) => {
        if (res.success) {
          this.mangerAndAuditUser = res.result
        }
      })
    },
    async getTotalBudget() {
      let res = await getAction(this.url.totalBudget, { id: this.projectBuildId })
      if (res.success) {
        if (res.result) {
          this.$set(this.custom, 'budgetAmount', parseInt(res.result))
        }
      }
    },
    async getProjectLevel() {
      let res = await getAction(this.url.getProjectLevel, { id: this.projectBuildId })
      if (res.success) {
        if (res.result) {
          this.$set(this.custom, 'projectLevel', res.result)
        }
      }
    },

    checkProjectBuildIsCanEdit() {
      getAction(this.url.checkProjectBuildIsCanEdit, { id: this.projectBuildId }).then((res) => {
        if (res.success) {
          this.isCanEdit = res.result.currentAudit
          this.projectStatus = res.result.status
        }
      })
    },
    handleEdit() {
      var url =
        '/projectbuildstup/baseInfo?projectClass=' +
        this.projectClass +
        '&projectBuildId=' +
        this.projectBuildId +
        '&currentAudit=' +
        (this.isCanEdit == '1' ? 'true' : 'false')
      let urlJump = this.$router.resolve({ path: url })
      window.open(urlJump.href, '_blank')
    },
    initReportStatusText(text) {
      switch (text) {
        case 1:
          this.reportStatusColor = { color: '#5dec0e' }
          return '待审批'
          break
        case 2:
          this.reportStatusColor = { color: '#5dec0e' }
          return '已报工'
          break
        default:
          this.reportStatusColor = { color: 'red' }
          return '未报工'
      }
    },
    openTimeNode(text, record) {
      if (this.projectClass == '30' && text == '项目实施') {
        const flag = this.checkManagerAndSubAdmin()
        this.$refs.taskListByApprovalTimeNode.doSelect(record.projectBuildId,flag)
      }
    },
    gotoItAdjustIndex() {
      let urlJump = this.$router.resolve({ path: '/itAdjustmentIndex?projectBuildId='+this.projectBuildId })
      window.open(urlJump.href, '_blank')
    },
    gotoPurchaseList(){
      let urlJump = this.$router.resolve({ path: '/purchaseApplyList' })
      window.open(urlJump.href, '_blank')
    },
    gotoItTaskReportIndex() {
      let urlJump = this.$router.resolve({ path: '/itTaskReportIndex' })
      window.open(urlJump.href, '_blank')
    },
    checkManagerAndSubAdmin(){
      var currUserId = Vue.ls.get(USER_INFO).username
      if ((this.projectAuditInfo.projectManagerIds && this.projectAuditInfo.projectManagerIds.indexOf(currUserId) >=0)
        || this.projectAuditInfo.projectSubTypeAdmin) {
          return true;
      } else {
        return false;
      }
    },
    openTimeReportOn60(record) {
      if (this.projectClass == '60') {
        let urlJump = this.$router.resolve({ path: `/timeNodeReport?projectBuildId=${record.projectBuildId}&timeNodeCode=${record.timeNodeCode}` })
        window.open(urlJump.href, '_blank')
      }
    },
    toChangeRecordList(){
    if (['40','41'].indexOf(this.projectClass)>-1 && this.projectBuild.projectTypeSubCategory != 'S') {
        let urlJump = this.$router.resolve({ path: '/projectChangeList?projectNo='+this.projectAuditInfo.projectBuild.projectNo })
        window.open(urlJump.href, '_blank')
      }
  },
    gotoLink(url) {
      let urlJump = this.$router.resolve({ path: url })
      window.open(urlJump.href, '_blank')
    },
    fileJoinSignAdd(){
      this.fileJoinSign.projectBuildId = this.projectBuild.id
      this.fileJoinSign.projectNo = this.projectBuild.projectNo
      this.fileJoinSign.projectName = this.projectBuild.projectName
      let listData = []
      getAction('/fileJoinSign/list',{projectNo : this.projectBuild.projectNo,pageSize: -1}).then((res) => {
        if (res.code === 200) {
            listData = res.result.records || []
          } else {
            this.$message.error(res.message)
          }
          this.fileJoinSign.showHistoryList = true
          this.fileJoinSign.historyData = listData
      })
    },
    openFileJoinSignAdd(billNo){
      this.windowOpen("/fileJoinSignAdd?billNo="+billNo)
    },
    handleProjectDone() {
      let projectTimeNode = ''
      if (this.projectAuditInfo.projectBuildTimeVOList && this.projectAuditInfo.projectBuildTimeVOList.length > 0) {
          this.projectAuditInfo.projectBuildTimeVOList.forEach(timeItem => {
            if (this.projectType == 'TE' && timeItem.timeNodeCode == '30' && timeItem.reportStatus == 2) {
              projectTimeNode ='30'
            }
            if (this.projectType != 'TE' && timeItem.timeNodeCode == '50' && timeItem.reportStatus == 2) {
                projectTimeNode ='50'
            }
            if (this.projectType != 'TE' && timeItem.timeNodeCode == '60' && timeItem.reportStatus == 2) {
                projectTimeNode ='60'
            }
          })
      } 
      let projectManager = ['30','40','41'].includes(this.projectClass) ? this.projectAuditInfo.approvalProjectManager : this.projectAuditInfo.projectManager
        let urlJump = this.$router.resolve({
        path: `/projectDone?projectBuildId=${this.projectBuildId}&projectNo=${this.projectAuditInfo.projectBuild.projectNo}
        &projectName=${this.projectAuditInfo.projectBuild.projectName}&projectManager=${projectManager}
        &projectSubType=${this.projectType}&projectTimeNode=${projectTimeNode}`,
      })
      window.open(urlJump.href, '_blank')
    },
    projectDoneShow() {
      if (this.projectClass == '10') {
        if (this.projectBuild.status == 10) {
          return true
        }
        if (this.projectAuditInfo.projectBuildTimeVOList && this.projectAuditInfo.projectBuildTimeVOList.length > 0) {
              let arr = this.projectAuditInfo.projectBuildTimeVOList.filter(timeItem => {
                if (this.projectType == 'TE' && timeItem.timeNodeCode == '30' && timeItem.reportStatus == 2) {
                  return true
                }
                if (this.projectType != 'TE' && ['50','60'].includes( timeItem.timeNodeCode) && timeItem.reportStatus == 2) {
                  return true
                }
                return false
              })
              if (arr && arr.length > 0) {
                return true
              }
          } 
      }
      return false
    }
  },
  destroyed() {
    document.removeEventListener('scroll', this.handleScroll)
  },
}
</script>
<style lang="less" scoped>
.approval {
  height: 100%;
  background: #f5f5f5;
  ul {
    list-style: none;
  }
  .banner {
    height: 80px;
    background-image: url('../../assets/banner-top.png');
    background-position: center;
  }
  .project-summary {
    padding: 0 125px 100px;
    position: relative;
    background: #f5f5f5;
    & /deep/ .ant-tabs-bar {
      border: none;
    }
    & /deep/ .ant-tabs-nav {
      background-color: #31a0e1;
      color: #fff;
      .ant-tabs-tab-active {
        background: #0581ca;
        color: #fff;
      }
      .ant-tabs-tab:hover {
        color: #fff;
      }
    }
    & /deep/ .ant-tabs {
      .ant-tabs-tab {
        margin: 0;
        padding: 10px 20px;
      }
      .ant-tabs-nav-container {
        width: 100%;
        background: #31a0e1;
        border-radius: 3px;
      }
    }
    .info-title {
      display: flex;
      align-items: center;
      margin: 10px 0;
      > img {
        margin-right: 5px;
      }
      > span {
        font-size: 16px;
        font-weight: 900;
        color: black;
      }
    }
    /deep/.ant-table-small > .ant-table-content > .ant-table-body {
      margin: unset;
    }
    &::v-deep .ant-table-thead > tr > th {
      padding-left: 20px;
      // font-size: px;
      // color: ;
      background: #dadee9 !important;
    }
    /deep/.ant-table-small,
    /deep/.ant-table-thead > tr:first-child > th:first-child,
    /deep/.ant-table-thead > tr:first-child > th:last-child {
      border-radius: unset;
    }
    ::v-deep .ant-table-tbody .ant-table-row {
      padding-left: 20px;
      background-color: #fff;
    }
    > div {
      margin-top: 1.5%;
    }
    .project-kpi {
      .info-detail {
        background-color: #fff;
        border: 1px solid #ebebeb;
        padding: 1% 2.5%;
        .info-list {
          padding: unset;
          display: flex;
          flex-wrap: wrap;
          margin: 0;
          > li {
            width: 33.33%;
            // height: 25px;
            display: flex;
            align-items: baseline;
            > img {
              margin-right: 5px;
            }
            .list-title {
              height: unset;
              font-weight: 900;
              white-space: nowrap;
            }
          }
        }
        .md-info-list{
          > li {
            line-height: 40 px;
            letter-spacing: 4px;
          }
        }
      }
    }
    .project-results {
      .info-detail {
        background-color: #fff;
        border: 1px solid #ebebeb;
        padding: 1% 2.5%;
        .info-list {
          padding: unset;
          display: flex;
          flex-wrap: wrap;
          margin: 0;
          font-size: 16px;
          > li {
            width: 25%;
            height: 25px;
            display: flex;
            align-items: center;
            position: relative;
            > img {
              margin-right: 5px;
            }
            .list-title {
              max-width: 300px;
              height: unset;
              font-weight: 900;
              white-space: nowrap;
            }
            .redfont {
              color: #fe6e6c;
              font-weight: bold;
              font-size: 18px;
              &.borderleft::after {
                content: '';
                width: 1px;
                height: 10px;
                color: red;
                border-left: 1px solid #e3e3e3;
                position: absolute;
                left: -10px;
                top: 0;
                bottom: 0;
                margin: auto;
              }
            }
          }
        }
      }
    }
    .project-schedule {
      .info-title {
        > img:nth-of-type(2) {
          width: 12px;
          margin-left: 5px;
        }
        > span:nth-of-type(2) {
          font-size: 14px;
          font-weight: normal;
        }
      }
    }
    .project-budget {
      font-size: 16px;
      ul {
        padding: 0;
      }
      .budget-content {
        .budget-box {
          .budget-title {
            padding: 5px 0 5px 20px;
            .fontblue {
              color: #368be4;
              display: inline-block;
              margin-right: 10px;
              font-weight: 900;
            }
            .fontred {
              color: #fc7a7f;
              font-weight: 900;
            }
          }
          .budget-content {
            padding: 0;
            li {
              display: flex;
              .bgColor {
                width: 200px;
                background-color: #dadee9;
                padding: 10px 0;
                display: inline-block;
                text-indent: 2em;
                border-bottom: 1px solid #fff;
              }
              .textCenter {
                text-align: center;
                text-indent: unset;
              }
              .bgwhite {
                background-color: #fff;
                // text-align: center;
                display: inline-block;
                padding: 10px 0 10px 30px;
                font-style: normal;
                border-bottom: 1px solid #f5f5f5;
                width: calc(100% - 550px);
                word-break: break-word;
              }
              > span:nth-of-type(2) {
                width: 150px;
              }
              > em:nth-of-type(2) {
                flex: 1;
                text-align: left;
                // text-indent: 2em;
              }
            }
          }
        }
      }
    }
    .attachment-detail {
      .attachment-content {
        & /deep/ .ant-table-small > .ant-table-content > .ant-table-body > table > .ant-table-thead > tr > th,
        /deep/.ant-table-small > .ant-table-content > .ant-table-body > table > .ant-table-tbody > tr > td {
          padding-left: 30px;
        }
      }
    }
    .approval-opinion {
      .opinion-box {
        padding: 0 5px;
        .opinion-detail {
          border-left: 1px dashed #e1e1e1;
          padding: 0px 15px;
          position: relative;
          &::before {
            content: '';
            position: absolute;
            background-color: #44b785;
            width: 10px;
            height: 10px;
            border-radius: 50%;
            left: -5px;
            top: 5px;
          }
          .opinion_title {
            font-weight: 900;
          }
          .opinion_info {
            border: 1px solid #ededed;
            background-color: #fff;
            padding: 20px 25px 0;
            margin: 5px 0;
            .signature {
              display: inline-block;
              width: 100%;
              text-align: right;
              font-weight: 700;
              > i {
                font-style: normal;
                color: #63ace5;
              }
            }
            .controlBox {
              text-align: right;
              margin: 1% 0;
              &/deep/ .ant-btn {
                border-radius: unset;
                margin-left: 5px;
                padding: 0 22px;
                font-size: 12px;
                height: 30px;
              }
              &/deep/ button:nth-last-child(1) {
                padding: 0 10px;
              }
            }
          }
        }
      }
    }
  }
  .project-summary {
    > ul {
      display: flex;
      background-color: #31a0e1;
      border-radius: 1px;
      color: #fff;
      padding: 0;
      font-size: 16px;
      font-weight: 900;
      li {
        padding: 10px 15px;
        cursor: pointer;
        &:hover,
        &.clickShow {
          background-color: #0581ca;
        }
      }
    }
    .floatNav {
      position: fixed;
      top: 50px;
      margin-top: 221px;
      display: flex;
      flex-direction: column;
      right: 15px;
      opacity: 0.8;
      z-index: 1;
    }
  }
  .process-engine {
    /deep/ #process-container {
      width: unset !important;
    }
    /deep/ #process-container .process-item .info-fullMessage {
      max-width: 1200px;
    }
  }
  /deep/ .el-loading-mask {
    z-index: 1 !important;
  }
}
.full-modal {
  /deep/ .ant-modal {
    max-width: 100%;
    top: 0 !important;
    padding-bottom: 0;
    margin: 0;
  }
  .ant-modal-content {
    display: flex;
    flex-direction: column;
    height: calc(100vh);
  }
  .ant-modal-body {
    flex: 1;
  }
}
/deep/ .full-modal {
   /deep/ .ant-modal {
    top: 0 !important;
  }
}
@media (max-width: 1080px) {
  div.approval .project-summary {
    padding: 0 30px 100px;
  }
}
</style>